<script>
    // 标签输入组件
    export default {
        name:'TagsInput',
        props: {
            value: String
        },
        render() {
            let tags = [, ,];
            if (this.value) {
                const temp = this.value.split('|');
                temp.forEach((i, index) => {
                    if (index < 3) tags[index] = i;
                })
            }

            return (
                <div>
                    <a-input maxLength={6} minLength={2} style="width:100px;margin-right:10px;" value={tags[0]} onInput={(e) => this.onInput(tags, 0, e.target.value)} />
                    <a-input maxLength={6} minLength={2} style="width:100px;margin-right:10px;" value={tags[1]} onInput={(e) => this.onInput(tags, 1, e.target.value)} />
                    <a-input maxLength={6} minLength={2} style="width:100px;margin-right:10px;" value={tags[2]} onInput={(e) => this.onInput(tags, 2, e.target.value)} />
                </div>
            )
        },
        methods: {
            onInput(tags, tagIndex, value) {
                tags[tagIndex] = value;
                const str = tags.filter(i=>i!='').join('|');
                this.$emit('input', str);
            }
        }
    }
</script>